<!-- 本页样式 -->
<style scoped>
.del-dialog-cnt {
	font-size: 16px;
	text-align: center;
}
</style>
<!-- 页面布局-->
<template>
	<div class="table">
		<!-- 标题导航栏 -->
		<div class="title-box crumbs">
			<el-breadcrumb separator="/">
				<el-breadcrumb-item>
					<i class="el-icon-tickets"></i>用户管理
				</el-breadcrumb-item>
				<el-breadcrumb-item>用户列表</el-breadcrumb-item>
			</el-breadcrumb>
		</div>
		<!-- 主体区 -->
		<div class="container">
			<!-- 查询条件 -->
			<div class="search-box">
				<div class="search-item-box">
					<table>
						<tr>
							<td>
								<i class="el-icon-search"></i>
							</td>
							<td class="search_td">
								<el-select v-model="parampters.type" clearable placeholder="用户类型">
									<el-option
										v-for="item in dicts.usertype"
										:key="item.CODE"
										:label="item.NAME"
										:value="item.CODE"
									></el-option>
								</el-select>
							</td>
							<td class="search_td">
								<el-input v-model="parampters.username" placeholder="登录名" class="handle-input mr10"></el-input>
							</td>
							<td class="search_td">
								<el-input v-model="parampters.mobile" placeholder="手机" class="handle-input mr10"></el-input>
							</td>
						</tr>
					</table>
				</div>
				<div class="search-button-box">
					<el-button type="primary" size="small" icon="search" @click="searchLoad">查询</el-button>
					<el-button type icon="add" size="small" @click="toAdd">添加用户</el-button>
				</div>
			</div>
			<!-- 查询条件END -->
			<!-- 数据列表 -->
			<div class="grid-data-box">
				<el-table
					:max-height="tableListHeight"
					:data="tableData"
					border
					:cell-class-name="changeColumnClass"
					:header-cell-style="{background:'#F3F3F3',color:'#606266'}"
					show-overflow-tooltip
					style="width: 100%"
					ref="multipleTable"
					@row-dblclick="clickToView"
				>
					<el-table-column type="index" label="序号" width="50" show-overflow-tooltip></el-table-column>
					<el-table-column prop="username" label="登录名" show-overflow-tooltip></el-table-column>
					<el-table-column prop="type" label="用户类型" :formatter="formatter" show-overflow-tooltip></el-table-column>
					<el-table-column prop="name" label="姓名" show-overflow-tooltip></el-table-column>
          			<el-table-column prop="mobile" label="手机" show-overflow-tooltip></el-table-column>
          			<!-- <el-table-column prop="certype" label="证件类型" width="120"  :formatter="formatter" show-overflow-tooltip></el-table-column> -->
					<!-- <el-table-column prop="cercode" label="证件编号" width="150" show-overflow-tooltip></el-table-column> -->
					<!-- <el-table-column prop="orgname" label="所属机构" :formatter="formatter" show-overflow-tooltip></el-table-column> -->
					<!-- <el-table-column prop="role" label="用户角色" :formatter="formatter" show-overflow-tooltip></el-table-column> -->
					<el-table-column
						prop="state"
						label="账号状态"
						width="80"
						:formatter="formatter"
						show-overflow-tooltip
					></el-table-column>
					<el-table-column prop="crttime" label="创建时间" width="150" show-overflow-tooltip></el-table-column>
					<el-table-column prop="lastlogtime" label="最后登录时间" width="150" show-overflow-tooltip></el-table-column>
					<el-table-column label="操作" width="220" show-overflow-tooltip>
						<template slot-scope="scope">
							<el-button size="mini" @click="toUpd( scope.row)" type="primary">编辑</el-button>
							<el-button size="mini" type="danger" @click="toDel( scope.row)" style="margin-left:5px">删除</el-button>
							<el-button size="mini" @click="toRoles( scope.row)" style="margin-left:5px">角色</el-button> 
						</template>
					</el-table-column>
				</el-table>
			</div>
			<!-- 数据列表END -->
			<!-- 翻页导航条 -->
			<div class="navigate-box">
				<div class="pagination">
					<el-pagination
						background
						@current-change="handleCurrentChange"
						:total="parampters.totalCount"
						@size-change="handleSizeChange"
						:current-page.sync="parampters.pageIndex"
						:page-sizes="[20, 50, 100, 200]"
						:page-size="parampters.pageRows"
						layout="total, sizes, prev, pager, next"
					></el-pagination>
				</div>
			</div>
			<!-- 翻页导航条END -->
		</div>
		<!-- 主体区END -->
	</div>
</template>


<script>
import viewModelDetail from "views/uim/ams/amsuser_upd.vue";
import viewModelbind from "views/uim/ams/amsuser_bind.vue";
import viewModelrole from "views/uim/ams/amsuser_role.vue";
import viewModelroleSingle from "views/uim/ams/amsuser_role_radio.vue";

export default {
	data() {
		return {
			// 筛选条件
			parampters: {
				//查询参数
				loginsid: "", //登录会话SID
				pageRows: 20, //每页行数
				pageCount: 0, //总页数
				pageIndex: 0, //当前页
				totalCount: 0 //总记录数
			},
			// 查询出的表格数据
			tableData: [],

			//confirm提示信息弹框
			confirmBox: null,
			//所选记录id
			selectedId: "",
			//事物类型
			actType: "list",
			//字典集
			dicts: {},
			modfuncs: {}
		};
	},
	// 进入页面加载数据
	activated() {
		this.handleInitLoad();
	},
	methods: {
		/**
		 * 初始操作按钮权限
		 */
		initModefuncs() {
			 
		},

		/**
		 * 初始加载字典选项
		 */
		initSelectOptoins() {
			this.loadSelectOptoins("usertype", null);
			this.loadSelectOptoins("certype", null);
		},
		/**
		 * 通用定义方法：加载下拉选择 字典
		 *  @augments dictKind 字典类型
		 */
		loadSelectOptoins(dictKind, params) {
			this.$dicts
				.loadDict(this.httpRoot.BASEURL_UIM, params, dictKind)
				.then(res => {
					this.$set(this.dicts, dictKind, res);
				});
		},

		changeColumnClass(data) {
			if (data.columnIndex == 1 || data.columnIndex == 2) {
				return "tabcolumn_left";
			}
		},

		/**
		 * @augments  row 行所在的数据
		 * 表格数据列 内容字典转换
		 */

		formatter(row, column) {
			if (column.property == "type") {
				return this.$dicts.transDict(
					this.dicts.usertype,
					"CODE",
					"NAME",
					row.type
				);
			} else if (column.property == "state") {
				if (row.state == 1) {
					return "启用";
				} else {
					return "禁用";
				}
			} else if (column.property == "certype") {
				return this.$dicts.transDict(
					this.dicts.certype,
					"CODE",
					"NAME",
					row.certype
				);
			} else if (column.property == "orgname") {
				return row.extendInfos.orgname;
			} else if (column.property == "role") {
				var r = "";
				row.roles.forEach(item => {
					r += item.rolename + " ";
				});
				return r;
			}
			return "";
		},
		/**
		 * @augments val 页码
		 * 切换页码操作
		 */
		handleCurrentChange(val) {
			this.parampters.pageIndex = val;
			// 重新获取当前页码的数据
			this.searchLoad();
		},

		/**
		 * @augments val 每页显示条数
		 * 每页显示条数修改
		 */
		handleSizeChange(val) {
			// 修改每页显示条数
			this.parampters.pageRows = val;
			// 重新获取数据
			this.searchLoad();
		},

		/**
		 * 组件初始化加载
		 */
		handleInitLoad() {
			this.initModefuncs();
			this.initSelectOptoins();
			this.searchLoad();
		},
		/**
		 * 条件筛选查询,加载数据
		 */
		searchLoad() {
			this.parampters = this.$util.trimObjStr(this.parampters);
			this.parampters.loginsid = this.$util.getLoginer().sessionId;
			this.$axios
				.get(this.httpRoot.BASEURL_UIM + "rest/uim/ams/amsuser/tolist", {
					params: this.parampters
				})
				.then(res => {
					if (res.data.result == "true") {
						let data = res.data; //
						this.tableData = data.resultData;
						this.parampters.pageIndex = parseInt(data.pageIndex);
						this.parampters.pageCount = parseInt(data.pageCount);
						this.parampters.totalCount = parseInt(data.totalCount);
					} else {
						this.$error(
							"查询失败" +
								res.data.resultMessage +
								",错误代码:" +
								res.data.resultCode
						);
					}
				})
				.catch(function(error) {});
		},

		/**
		 * 新增记录信息
		 */
		toAdd() {
			//页面参数
			var pageParam = {
				loginInfo: this.$util.getLoginer(),
				actType: "add",
				seleid: "-1"
			};
			// this.$router.push({
			//   path: "/amsuserDetail",
			//   query: pageParam
			// });
			//
			let commDialog = this.$dialog.commDialog(
				"添加用户信息",
				viewModelDetail,
				pageParam,
				"700px",
				"440px"
			);
			commDialog.exec.then(data => {
				this.searchLoad();
			});
		},

		/**
		 * 修改记录信息
		 * @augments index 编辑数据所在的行索引
		 * @augments row 编辑数据行的数据
		 */
		toUpd(row) {
			this.selectedId = row.userid;
			//页面参数
			var pageParam = {
				actType: "upd",
				seleid: this.selectedId
			};
			// this.$router.push({
			//   path: "/amsuserDetail",
			//   query: pageParam
			// });
			let commDialog = this.$dialog.commDialog(
				"编辑用户信息",
				viewModelDetail,
				pageParam,
				"700px",
				"440px"
			);
			commDialog.exec.then(resp => {
				if (resp.type == "ok") {
					this.searchLoad();
				} else if (resp.type == "cancel") {
				}
			});
		},
		//
		clickToView(rowData, column, event) {
			this.toView(rowData);
		},
		/**
		 * 查看记录信息
		 * @augments row 编辑数据行的数据
		 * @augments ev
		 */
		toView(row) {
			this.selectedId = row.userid;
			//页面参数
			var pageParam = {
				actType: "view",
				seleid: this.selectedId
			};
			// this.$router.push({
			//   path: "/amsuserDetail",
			//   query: pageParam
			// });
			let commDialog = this.$dialog.commDialog(
				"查看用户信息",
				viewModelDetail,
				pageParam,
				"700px",
				"440px"
			);
			commDialog.exec.then(data => {});
		},

		/**
		 * 删除记录信息
		 * @augments index 所在表格行的索引
		 * @augments row 所在表格行的所有数据对象
		 */
		toDel(row) {
			this.selectedId = row.userid;
			this.confirmBox = this.$dialog.confirm("确定删除所选记录吗？");
			this.confirmBox.exec.then(btnName => {
				if (btnName == "ok") {
					// 确定删除数据操作
					this.$axios
						.post(this.httpRoot.BASEURL_UIM + "rest/uim/ams/amsuser/delsave", {
							loginsid: this.$util.getLoginer().sessionId,
							userid: this.selectedId
						})
						.then(res => {
							if (res.data.result == "true") {
								this.$dialog.close(this.confirmBox.vm);
								this.$message.success("删除成功");
								this.searchLoad();
							} else {
								this.$dialog.close(this.confirmBox.vm);
								this.$error(
									"删除失败：" +
										res.data.resultMessage +
										",错误代码:" +
										res.data.resultCode
								);
							}
						});
				} else {
					this.$dialog.close(this.confirmBox.vm); // 取消删除数据操作
				}
			});
		},
		/**
		 * 弹出分配角色dialog
		 * @param {Object} data 当前节点的数据对象
		 * @param {Object} node 当前节点对象
		 */
		toRoles(row) {
			//如果不是当前选中的节点去配置角色的话那么点击无效
			var dialogParams = {
				loginInfo: this.$util.getLoginer(),
				userid: row.userid
			};
			//
			if (this.$util.getLoginer().administrator == true) {
				let commDialog = this.$dialog.commDialog(
					"设置用户[" + row.name + "]角色",
					viewModelrole,
					dialogParams,
					"800px",
					"480px"
				);
				commDialog.exec.then(data => {});
			} else {
				let commDialog = this.$dialog.commDialog(
					"设置用户[" + row.name + "]角色",
					viewModelroleSingle,
					dialogParams,
					"800px",
					"480px"
				);
				commDialog.exec.then(data => {});
			}
		},

		toBind(row) {
			var dialogParams = {
				loginInfo: this.$util.getLoginer(),
				userid: row.userid,
				usertype: row.type
			};
			let commDialog = this.$dialog.commDialog(
				"设置用户[" + row.name + "]关联信息",
				viewModelbind,
				dialogParams,
				"800px",
				"600px"
			);
			commDialog.exec.then(data => {});
		}
	}
};
</script>
